{% extends "layout/content.twig" %}

{% block main %}
    <div class="layui-card">
        <div class="layui-card-header">模型提取</div>
        <div class="layui-card-body">

            <div class="layui-row">
                <div class="layui-col-md4">
                    <form class="layui-form" action="">
                        {% include "develop/table.twig" %}
                    </form>
                </div>
            </div>

            <div class="layui-tab layui-tab-brief" lay-filter="action">
                <ul class="layui-tab-title">
                    {% for key,item in action %}
                        <li class="{% if key=='columns' %}layui-this{% endif %}"
                            data-tab-action="{{ key }}">
                            {{ item }}
                        </li>
                    {% endfor %}
                </ul>
                <div class="layui-tab-content">
                    {% for key,item in action %}
                        <div class="layui-tab-item {% if key=='columns' %}layui-show{% endif %}">
                            <div class="mt20">
                                <pre class="layui-code" data-tab-pre="{{ key }}">暂无数据</pre>
                            </div>
                        </div>
                    {% endfor %}
                </div>
            </div>
        </div>
    </div>
{% endblock %}

{% block script %}
    <script type="text/javascript">
        layui.use(['element', 'code', 'form', 'http'], function () {
            let form = layui.form
            let element = layui.element
            let http = layui.http

            let table = ''
            let action = 'columns'
            code('[data-tab-pre=' + action + ']')

            form.on('select(table)', function (data) {
                table = data.value
                transfer()
            })

            element.on('tab(action)', function (data) {
                action = $('[data-tab-action]').eq(data.index).data('tab-action')
                transfer()
            })

            function transfer() {

                if (!table) {
                    return false
                }

                http.post('{{ auth_route('develop/model') }}', {
                    table: table,
                    action: action
                }).then(res => {
                    $('.layui-tab-brief .layui-show .layui-code').text(res)
                    code('[data-tab-pre=' + action + ']')
                })
            }

            function code(elem) {

                if (!elem || $(elem).length === 0) {
                    return false
                }

                layui.code({
                    elem: elem,
                    title: 'Php',
                    preview: true,
                    layout: ['code'],
                    tools: ['full', 'window'],
                    header: true,
                    langMarker: true,
                    lang: 'html',
                    codeStyle: 'min-height:400px'
                })
            }
        })
    </script>
{% endblock %}